{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no">
    <title> {% block title %} {% endblock title %} </title>
    <link href="{% static 'assets/css/loader.css' %}" rel="stylesheet" type="text/css" />
    <script src="{% static 'assets/js/loader.js' %}"></script>
    <link href="https://fonts.googleapis.com/css?family=Nunito:400,600,700" rel="stylesheet">
    <link href="{% static 'bootstrap/css/bootstrap.min.css' %}" rel="stylesheet" type="text/css" />
    <link href="{% static 'assets/css/plugins.css' %}" rel="stylesheet" type="text/css" />
    <script src="{% static 'plugins/notification/snackbar/snackbar.min.js' %}"></script>
    <link href="{% static 'plugins/notification/snackbar/snackbar.min.css' %}" rel="stylesheet" type="text/css">
    <!-- load any page wise jquery or stylesheet -->

    {% block custom_js_css_link %}
    {% endblock custom_js_css_link %}
</head>
<body>
    <div id="load_screen"> <div class="loader"> <div class="loader-content">
        <div class="spinner-grow align-self-center"></div>
    </div></div></div>

    <!-- TOP NAVBAR BEGIN -->
    {% include 'base/_items/top_nav.html' %}
    <!-- TOP NAVBAR ENDS -->

    <!--  BEGIN BREADCRUMB  -->
    <div class="sub-header-container">
        <header class="header navbar navbar-expand-sm">
            <a href="javascript:void(0);" class="sidebarCollapse" data-placement="bottom"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-menu"><line x1="3" y1="12" x2="21" y2="12"></line><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="18" x2="21" y2="18"></line></svg></a>

            <ul class="navbar-nav flex-row">
                <li>
                    <div class="page-header">
                        <div class="page-title">
                            <h3>{% block breadcrumb_title %}{% endblock breadcrumb_title %}</h3>
                        </div>
                    </div>
                </li>
            </ul>
        </header>
    </div>
    <!--  END BREADCRUMB  -->

    <!--  BEGIN MAIN CONTAINER  -->
    <div class="main-container" id="container">

        <div class="overlay"></div>
        <div class="search-overlay"></div>

        <!--  BEGIN SIDEBAR  -->
        {% include 'base/_items/sidebar.html' %}
        <!--  END SIDEBAR  -->
        <!--  BEGIN CONTENT PART  -->
        <div id="content" class="main-content">

            <div class="layout-px-spacing">
                <div class="row layout-top-spacing">
                    {% if messages %}
                    {% for message in messages %}
                    <script type="text/javascript">
                    Snackbar.show({
                        text: '{{ message }}',
                        pos: 'top-right'
                    });
                    </script>
                    {% endfor %}
                    {% endif %}
                    {% block main_content %}

                    {% endblock main_content %}
                </div>

            </div>
        </div>
        <!--  END CONTENT PART  -->

    </div>
    <!-- END MAIN CONTAINER -->

    <script src="{% static 'assets/js/libs/jquery-3.1.1.min.js' %}"></script>
    <script src="{% static 'bootstrap/js/popper.min.js' %}"></script>
    <script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
    <script src="{% static 'plugins/perfect-scrollbar/perfect-scrollbar.min.js' %}"></script>
    <script src="{% static 'assets/js/app.js' %}"></script>
    <script>
    $(document).ready(function() {
        App.init();
    });
    </script>
    <script src="{% static 'assets/js/custom.js' %}"></script>
    {% block page_level_script %}

    {% endblock page_level_script%}
</body>
</html>
